(function () {
    //将girls的list2动态渲染到页面中
    $(function () {
        $.ajax({
            url: "./prods",
            type: "get",
        }).done(function (res) {
            console.log(res);
            let strHtml = ``;
            let { data } = res;
            console.log(data);
            data.forEach(el => {
                strHtml += `
                <li>
                    <div class="imgBox pos-r">
                        <a href="./2.details.html?pid=${el.pid}"><img src="${el.img}" alt=""></a>
                        <div class="discount pos-a">
                            <img src="./images/renqi_2.1.png" alt="">
                        </div>
                    </div>
                    <div class="text">
                        <div class="line1">
                            <a href="" class="fl">ME＆CITY</a>
                            <span class="fr">1.5折</span>
                        </div>
                        <a href="" class="goods">${el.pname}</a>
                        <div class="line3">
                            <span>￥${el.pprice}</span>
                            <span>￥199</span>
                        </div>
                    </div>
                </li>
                `
            });
            $(".girls").find(".list2").html(strHtml);
        })

    })







    //透明轮播图
    class OpacitySlideShow {
        constructor(cls) {
            this.$bigBox = $(cls);
            this.$ul = this.$bigBox.children().find("ul");
            this.$ol = this.$bigBox.children().find("ol");
            // console.log(this.$ul);
            // console.log(this.$ol);
            this.tempIndex = 0;
        }
        autoPlay() {
            this.tempIndex++;
            if (this.tempIndex == 5) {
                this.tempIndex = 0;
            }
            //排他
            // console.log(this.$ul.children());
            this.$ul.children().eq(this.tempIndex).animate({ opacity: 1 }).siblings().animate({ opacity: 0 })
            this.$ol.children().eq(this.tempIndex).animate({ opacity: 1 }).siblings().animate({ opacity: 0.3 })
        }
        interval() {//启动定时器
            this.$bigBox.timer = setInterval(() => { this.autoPlay() }, 1500);
            this.move();
        }
        move() {
            let self = this;
            this.$bigBox.on("mouseenter", function () {
                clearInterval(self.$bigBox.timer);
            })
            this.$bigBox.mouseleave(() => {
                this.$bigBox.timer = setInterval(() => {
                    this.autoPlay();
                }, 1500);
            })
            // console.log(this.$ol.children());
            this.$ol.children().mouseenter(function () {
                self.tempIndex = $(this).index() - 1;
                self.autoPlay();
            })
        }

    }

    $(function () {
        new OpacitySlideShow(".bigBox").interval();
    })


    //关闭头部
    $(function () {
        $(".close").click(function () {
            $(".header .top").hide();
            $(".header").css("height", "36px");
        })
    })


    $.fn.getSrcoll = () => {
        //ie9+ google,火狐
        if (window.pageYOffset != undefined) {
            return {
                left: window.pageXOffset,
                top: window.pageYOffset
            }
        } else if (document.compatMode == 'CSS1Compat') {
            //带有dtd准备声明头
            return {
                left: document.documentElement.scrollLeft,
                top: document.documentElement.scrollTop
            }
        }
        return {
            //怪异模式
            left: document.body.scrollLeft,
            top: document.body.scrollTop
        }
    }

    //返回顶部
    $(function () {
        //让top显示与隐藏
        $(document).on("scroll", _.debounce(function () {
            let $scrollTop = $(this).getSrcoll().top;
            // console.log($scrollTop);
            if ($scrollTop > 1200) {
                $(".back").show();
            } else {
                $(".back").hide();
            }
        }, 200))

        //返回顶部
        $(".back").on("click", _.debounce(function () {
            let timer_1 = setInterval(() => {
                //当前值
                let $current = $(this).getSrcoll().top;
                //目标值
                let $target = 0;
                //步长
                let $steps = ($target - $current) / 10;
                $steps = $steps > 0 ? Math.ceil($steps) : Math.floor($steps);
                window.scrollTo({
                    top: $current + $steps,
                })
                // console.log($target, $current);
                if ($current == $target) {
                    clearInterval(timer_1);
                    // console.log(11111);
                }

            }, 40)
        }, 200))
    })



    //咨询
    $(function () {
        $(".consult").click(function () {
            $(".showBox").show();
        })
        $(".showBox-close").click(function () {
            $(".showBox").hide();
        })
        $(".cancel").click(function () {
            $(".showBox").hide();
        })
        $(".confirm").click(function () {
            window.location.replace("../4.login.html");
        })
    })


    //nav部分的下拉列表
    window.onload = function () {
        $(function () {
            $(".pulldownList").mouseover(function () {
                $(".group-box").show()
            })
            $(".pulldownList").mouseout(function () {
                $(".group-box").hide()
            })
        })
    }

    //图片延迟加载
    $(function () {
        // console.log([...$(".product").find("img")]);
        [...$(".product").find("img")].forEach((el, index) => {
            $(el).addClass("lazy");
            $(el).attr("data-original", $(el).attr("src"));
            $("img.lazy").lazyload({ effect: "fadeIn" });
        })
    })

    //登录之后头部发生变化
    //让头部显示M+电话
    $(function () {
        // console.log(JSON.parse(localStorage.getItem("userInfo")).uPhone);
        if (!(JSON.parse(localStorage.getItem("userInfo")))) {
            return
        }
        let data = JSON.parse(localStorage.getItem("userInfo") || "{}");
        $(".loginAfter").find(".username").text("M" + data.uPhone);
        $(".loginBef").hide();//你好 注册 隐藏
        $(".loginAfter").show();//你好 M15234197057 显示
        $(".exit").click(function () {
            localStorage.clear("userInfo");
            //3.头部你好变回原来内容
            $(".loginBef").show();
            $(".loginAfter").hide();
        })

    })

})()